{include file='/public/index-header'}
<body>
    {include file='/public/index-nav'}
    <div class="layui-container ws-container">
        <div class="layui-row" style="margin: 60px 0px;">
            <div class="layui-col-md3">
                <div class="wrap">
                    <div class="avatarWrap">
                        <div class="avatar">
                            <div class="updateAvatarWrap" data-modal="{:sysuri('edit')}" data-area = "['900px','600px']">
                                <img class="img" src="{$user['avatar']|default='__STATIC__/plugs/index/img/default_avatar.png'}">
                                <div class="updateAvatar">{:lang('修改头像')}</div>
                            </div>
                        </div><span class="name" title="{$user['true_name']|default=''}">{$user['true_name']|default=$user['nick_name']}</span>
                    </div>
                    <div>
                        <div class="title">{:lang('账号管理')}</div>
                        <ul class="zh_list" style="padding-left: 30px;">
                            <li class="item active">
                                <span>
                                    <i class="layui-icon layui-icon-username"></i>{:lang('基本信息')}
                                </span>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="layui-col-md9">
                <div class="layui-row">
                    <div class="content___PtdDU">
                        <div class="titleWrap___DpFsH">
                            <div class="title___Ijn2y">{:lang('基本信息')}</div>
                            <button type="button" class="layui-btn layui-btn-primary layui-border-blue" data-modal="{:sysuri('edit')}" data-area = "['900px','600px']">
                                <span>{:lang('修改')}</span>
                            </button>
                        </div>
                        <form class="layui-form">
                            <div class="layui-form-item cus_item">
                                <div class="layui-row row_display">
                                    <div class="layui-col-md1 cus_label">
                                        <label class="" title="">{:lang('姓名')}:</label>
                                    </div>
                                    <div class="layui-col-md11">
                                        <div class="form-item-control">
                                            <div class="form-item-control-content">{$user.true_name|default=''}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item cus_item">
                                <div class="layui-row row_display">
                                    <div class="layui-col-md1 cus_label">
                                        <label class="" title="">{:lang('手机号')}:</label>
                                    </div>
                                    <div class="layui-col-md11">
                                        <div class="form-item-control">
                                            <div class="form-item-control-content">{$user.mobile|default=''}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item cus_item">
                                <div class="layui-row row_display">
                                    <div class="layui-col-md1 cus_label">
                                        <label class="" title="">{:lang('邮箱')}:</label>
                                    </div>
                                    <div class="layui-col-md11">
                                        <div class="form-item-control">
                                            <div class="form-item-control-content">{$user.email|default=''}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item cus_item">
                                <div class="layui-row row_display">
                                    <div class="layui-col-md1 cus_label">
                                        <label class="" title="">{:lang('学校/单位')}:</label>
                                    </div>
                                    <div class="layui-col-md11">
                                        <div class="form-item-control">
                                            <div class="form-item-control-content">{$user.job_place|default=''}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item cus_item">
                                <div class="layui-row row_display">
                                    <div class="layui-col-md1 cus_label">
                                        <label class="" title="">{:lang('院系/部门')}:</label>
                                    </div>
                                    <div class="layui-col-md11">
                                        <div class="form-item-control">
                                            <div class="form-item-control-content">{$user.job_depart|default=''}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item cus_item">
                                <div class="layui-row row_display">
                                    <div class="layui-col-md1 cus_label">
                                        <label class="" title="">{:lang('专业')}:</label>
                                    </div>
                                    <div class="layui-col-md11">
                                        <div class="form-item-control">
                                            <div class="form-item-control-content">{$user.major|default=''}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item cus_item">
                                <div class="layui-row row_display">
                                    <div class="layui-col-md1 cus_label">
                                        <label class="" title="">{:lang('学号/工号')}:</label>
                                    </div>
                                    <div class="layui-col-md11">
                                        <div class="form-item-control">
                                            <div class="form-item-control-content">{$user.job_number|default=''}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item cus_item">
                                <div class="layui-row row_display">
                                    <div class="layui-col-md1 cus_label">
                                        <label class="" title="">{:lang('昵称')}:</label>
                                    </div>
                                    <div class="layui-col-md11">
                                        <div class="form-item-control">
                                            <div class="form-item-control-content">{$user.nick_name|default=''}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item cus_item">
                                <div class="layui-row row_display">
                                    <div class="layui-col-md1 cus_label">
                                        <label class="" title="">{:lang('性别')}:</label>
                                    </div>
                                    <div class="layui-col-md11">
                                        <div class="form-item-control">
                                            <div class="form-item-control-content">{$user.sex|default=''}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item cus_item">
                                <div class="layui-row row_display">
                                    <div class="layui-col-md1 cus_label">
                                        <label class="" title="">{:lang('最高学历')}:</label>
                                    </div>
                                    <div class="layui-col-md11">
                                        <div class="form-item-control">
                                            <div class="ant-form-item-control-input-content">{$user.edu_background|default=''}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item cus_item">
                                <div class="layui-row row_display">
                                    <div class="layui-col-md1 cus_label">
                                        <label class="" title="">{:lang('简介')}:</label>
                                    </div>
                                    <div class="layui-col-md11">
                                        <div class="form-item-control">
                                            <div class="ant-form-item-control-input-content">{$user.intro|default=''}</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {include file='/public/index-foot'}
</body>

<style type="text/css">
    .wrap {
        border-radius: 2px;
        box-shadow: 0 4px 9px 0 rgba(11,62,120,.21);
        height: 460px;
        margin-bottom: 30px;
        margin-right: 20px;
        min-width: 290px;
        padding-bottom: 30px;
        padding-top: 8px
    }

    .avatarWrap {
        align-items: center;
        display: flex;
        flex-direction: column;
        text-align: center
    }

    .avatar {
        background: #fff;
        border-radius: 50%;
        box-sizing: border-box;
        float: left;
        height: 115px;
        margin-top: 19px;
        padding: 3px;
        position: relative;
        text-align: center;
        width: 115px
    }

    .updateAvatarWrap {
        overflow: hidden;
        position: relative
    }

    .img,.updateAvatarWrap {
        border-radius: 50%;
        height: 109px;
        width: 109px
    }

    .img {
        border-style: none;
        cursor: pointer;
        vertical-align: middle
    }

    .updateAvatar {
        background: rgba(76,172,255,.7);
        color: #fff;
        cursor: pointer;
        height: 23px;
        left: 0;
        line-height: 23px;
        position: absolute;
        text-align: center;
        top: 45px;
        width: 110px
    }

    .name {
        color: #05101a;
        font-size: 24px;
        height: 36px
    }

    .title {
        color: #05101a;
        font-size: 18px;
        font-weight: 400;
        margin-top: 6px;
        padding: 10px 28px
    }

    .item {
        border-left: 2px solid #fff;
        color: #4d4d4d;
        cursor: pointer;
        display: flex;
        flex-direction: row;
        font-size: 16px;
        justify-content: space-between;
        list-style-type: none;
        padding: 6px 0 6px 30px
    }

    .active, .zh_list li:hover {
        background: #e6f3ff;
        border-left: 2px solid #0152d9
    }

    .item.active i:first-child {
        color: #0152d9
    }

    .content___PtdDU {
        background: #fff;
        box-sizing: border-box;
        margin-bottom: 10px;
        min-height: 390px;
        padding: 30px;
        width: 100%
    }

    .titleWrap___DpFsH {
        display: flex;
        justify-content: space-between
    }

    .title___Ijn2y {
        font-size: 16px;
        margin-bottom: 10px;
        padding-left: 30px
    }

    .cus_label {
        text-align: right;
        margin-right: 10px;
    }

    .cus_item {
        padding: 10px 0px 0px 0px;
    }

    .form-item-control {
        position: relative;
        display: flex;
        align-items: center;
        min-height: 32px;
    }

    .row_display {
        display: flex;
        align-items: center;
    }
</style>
<script type="text/javascript" >
    $(function () {
        layui.use(['layer', 'form'], function () {
            let form = layui.form;
            let layer = layui.layer;
            $('.zh_list').find('li').click(function (elem) {
                $(elem.currentTarget).addClass('active').siblings().removeClass('active');
            })
            // 提交订单
            form.on('submit(save)', function(data){
                let form_data = data.field
                httpRequest("{:sysuri('edit')}", form_data, 'post', function(info, data){
                    $.msg.success(info, 3, function () {
                        location.href = '{:sysuri("index")}';
                    });
                });
                return false;
            })
        })
    })
</script>